<script setup>
import {ref} from "vue";
import {userLogin} from '@/api/user'
import router from "@/router/index.js";
import {ElMessage} from "element-plus";

const userData = ref({
  uname: '',
  upassword: ''
})
const login = async ()=>{
  let result = await userLogin(userData.value)
  console.log("登录结果：")
  console.log(result)
  if (result.data.code == 200) {
    ElMessage.success("登录成功")
    localStorage.setItem('token',result.data.data)
    localStorage.setItem('username',userData.value.uname)
    if (userData.value.uname == 'root') {
      localStorage.setItem('root','root')
    }
    router.push('/index')
  }
}
</script>

<template>
  <body>
  <div class="box">
    <div class="dly">
      <div class="dly_left"></div>
<!--      <form action="http://localhost:8893/admin/login" method="get">-->
        <div class="dly_right">
          <p class="tit">登陆验证</p>
          <div class="zc_username">
            <span class="zc_tit">用户名</span>
            <input type="text" id="userName" name="uname" class="username" v-model="userData.uname" />
            <!-- for="email"-->
          </div>
          <div class="zc_password">
            <span class="zc_tit">密&nbsp;&nbsp;&nbsp;码</span>
            <input type="password" id="password" name="upassword" class="pass_word" v-model="userData.upassword" />
            <!-- for="email"-->
            <label class="error" id="pass_word_error"></label>
          </div>
          <button id="btn-ty" class="btn-ty" value="登录" @click="login">登录</button>
          <!--<button id="btn-ty" class="btn-ty" onclick="login.doLogin();">登录</button>-->

          <p class="cstyle">没有账号？<a href='/register'>立即注册</a></p>
        </div>
<!--      </form>-->
    </div>
  </div>
  </body>
</template>

<style src="src/assets/css/public.css"></style>
<style src="src/assets/css/login.css"></style>
<style scoped>

</style>